<template>
    <!--系统管理 -- 参数配置-->
    <div>
        <div style="height: 30px; line-height: 30px;padding-left: 20px;">
              <h1>参数配置</h1>
        </div> 
                <div style="border: 1px red solid;">
                    <ui-form :model="paramConfigForm" ref="paramForm" label-width="100px" class="demo-ruleForm">
                <ui-row type="flex" class="row-bg" justify="space-around">
                <ui-col :span="8">
                    <ui-form-item label="参数编号" prop="paramNo">
                    <ui-input v-model="paramConfigForm.paramNo"></ui-input>
                    </ui-form-item>
                </ui-col>
                <ui-col :span="8">
                    <ui-form-item label="参数名称" prop="paramname">
                    <ui-input v-model="paramConfigForm.paramname"></ui-input>
                    </ui-form-item>
                </ui-col>
                </ui-row>
                <ui-row type="flex" class="row-bg" justify="center">
                <ui-button type="primary" @click="submitForm('paramForm')">查询</ui-button>
                <ui-button @click="resetForm('paramForm')">重置</ui-button>
                </ui-row>
            </ui-form>


        </div>
        <div style="border: 1px red solid; border-top: none;">

        

            <vx-table :tableData="tableData" :isSelect="false" :columns="columns" @multipleSelection="multipleSelection"
                :buttomGroup="buttomGroup" @openDetails="openDetails" ></vx-table>
                <ui-pagination
            :total="total"
            :page-size="pageSize"
            :current-page="currentPage"
            :layout="layout"
            :page-sizes="pageSizeList"
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
        >
        </ui-pagination>
        </div>
                
                <ui-dialog title="修改参数" :visible.sync="dialogFormVisible"> 
                <ui-form :model="modifyForm" :rules="rules" ref="modifyForm" label-width="100px">
                    <ui-row type="flex" class="row-bg" justify="center">
                    <ui-col :span="12">
                        <ui-form-item label="参数编号：">
                        <span>{{modifyForm.paramNo }}</span>
                        </ui-form-item>
                    </ui-col>
                    </ui-row>
                    <ui-row type="flex" class="row-bg" justify="center">
                    <ui-col :span="12">
                        <ui-form-item label="参数名称：" prop="paramName">
                        <ui-input v-model="modifyForm.paramName" placeholder="请输入内容"></ui-input>
                        </ui-form-item>
                    </ui-col>
                    </ui-row>
                    <ui-row type="flex" class="row-bg" justify="center">
                    <ui-col :span="12">
                        <ui-form-item label="参数内容：" prop="paramcontet">
                        <ui-input v-model="modifyForm.paramcontet" placeholder="请输入内容"></ui-input>
                        </ui-form-item>
                    </ui-col>
                    </ui-row>
                    <ui-row type="flex" class="row-bg" justify="center">
                    <ui-col :span="12">
                        <ui-form-item label="参数说明：" prop="paramdetails">
                        <ui-input type="textarea" placeholder="请输入内容" v-model="modifyForm.paramdetails" maxlength="30" show-word-limit> </ui-input>
                        </ui-form-item>
                    </ui-col>
                    </ui-row>
                
                </ui-form>
                <div slot="footer" class="dialog-footer">
                    <ui-row type="flex" class="row-bg" justify="center">
                    <ui-button @click="dialogFormVisible = false">取 消</ui-button>
                    <ui-button type="primary" @click="onConfirm('modifyForm')">确 定</ui-button>
                    </ui-row>
                    
                </div>
                </ui-dialog>




    </div>

</template>
<script>
import pagination from '@/common/mixin/pagination.js'; // 混入分页
import vxTable from '@/components/vx-table';

export default{
    mixins: [pagination],
    components:{
        vxTable,
    },
   data(){
    return{
        dialogVisible:true,
        searchForm:{
            customerName:'',
            customerNo:'',
            startDate:'',
            endDate:''
        },
        layout:"total, sizes, prev, pager, next, jumper", // 分页顺序
        columns:[
            {
            prop: 'userName',
            label: '参数编号',
            fixed: true,
            },
            {
            prop: 'userName',
            label: '参数名称',
            fixed: true,
            },
            {
            prop: 'userName',
            label: '参数内容',
            fixed: true,
            },
            {
            prop: 'userName',
            label: '参数说明',
            fixed: true,
            },

        ],
        tableData:[],
        buttomGroup:[
        { label: '修改', methodsName: 'openDetails' }
        ]
    }
   },
   methods:{
    checkdate(){
       console.log("11"); 
    }
   }
}
</script>
<style lang="scss" scoped>
 ::v-deep .ui-input__prefix{
  display: none;
}
</style>